<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title></title> 

</head>
<jsp:include page="../default.jsp" />
<body>
    		<table border="0" cellpadding="0" cellspacing="2" style="width:100%;height:100%">
		<tr><th>已加入的用户</th><th></th><th>未加入的用户</th>   </tr>
		  <tr>
		    <td>
		    <div class="mini-fit">
		<div id="datagrid1" class="mini-datagrid" style="width: 100%; height: 100%;" 
		url="${pageContext.request.contextPath}/auth/userRole/queryRoleUser.do?queryType=in" idField="id" 
       	 multiSelect="true" allowUnselect="true" allowAlternating="true" onload="PageHelper.prototype.commonError">
            <div property="columns">
            	<div type="checkcolumn"></div>
            	<div field="loginName" headerAlign="center">登录名</div>
            	<div field="name" headerAlign="center">姓名</div>
        	</div>
       	</div> 
       	</div>	    
		    </td>
		    <td width="25" valign="middle">
		    	<table>
		    		<tr>
		    			<td>
		    			 <a class="mini-button"  onclick="addRoleUser()">&lt;&lt;</a>
		    			</td>
		    		</tr>
		    		<tr>
		    			<td style="height:10px"></td>
		    		</tr>
		    		<tr>
		    			<td>
		    			 <a class="mini-button"  onclick="removeRoleUser()">&gt;&gt;</a>
		    			</td>
		    		</tr>
		    	</table>
		    </td>
		    <td>
		    <div class="mini-fit">
		<div id="datagrid2" class="mini-datagrid" style="width: 100%; height: 100%;" 
		url="${pageContext.request.contextPath}/auth/userRole/queryRoleUser.do?queryType=notIn" idField="id" 
       	 multiSelect="true" allowUnselect="true" allowAlternating="true" onload="PageHelper.prototype.commonError">
            <div property="columns">
            	<div type="checkcolumn"></div>
            	<div field="loginName" headerAlign="center">登录名</div>
            	<div field="name" headerAlign="center">姓名</div>
        	</div>
       	</div> 
       	</div>     
		    </td>
		  </tr>
		</table>
    <script type="text/javascript">   
    	new PageHelper().init();
    	mini.parse();
    	var grid1 = mini.get("datagrid1");
    	var grid2 = mini.get("datagrid2");
    	var roleId;
    	
    	function setData(data) {
            data = mini.clone(data);
            grid1.load({roleId: data.id});
            grid2.load({roleId: data.id});
            roleId = data.id;
        }
    	
    	function addRoleUser(){
    		var keys = CommonUtil.prototype.getSelectKeys('datagrid2', "id");
    		if(keys){
    			CommonUtil.prototype.mask();
				$.ajax({
                	url: "${pageContext.request.contextPath}/auth/userRole/addRoleUser.do?roleId=" + roleId,
                	data : {keys: keys},
                	type : "POST",
					dataType : "json",
                	success: function (data, textStatus, jqXHR) {
                		CommonUtil.prototype.unmask();
                		if(data.success){
                			mini.alert("授权成功", "提醒", function(){
                				grid1.reload();
                				grid1.clearSelect();
                				grid2.reload();
                				grid2.clearSelect();
							});
                		}                       
                	}
            	});
    		}
    	}
    	
    	function removeRoleUser(){
    		var keys = CommonUtil.prototype.getSelectKeys('datagrid1', "id");
    		if(keys){
    			CommonUtil.prototype.mask();
				$.ajax({
					url: "${pageContext.request.contextPath}/auth/userRole/removeRoleUser.do?roleId=" + roleId,
                	data : {keys: keys},
                	type : "POST",
					dataType : "json",
                	success: function (data, textStatus, jqXHR) {
                		CommonUtil.prototype.unmask();
                		if(data.success){
                			mini.alert("取消授权成功", "提醒", function(){
                				grid1.reload();
                				grid1.clearSelect();
                				grid2.reload();
                				grid2.clearSelect();
							});
                		}                       
                	}
            	});
    		}
    	}
	</script>
  </body>
</html>
